<script src="./script.js"></script>
<style src="./style.css"></style>
<template>
  <div class="app-container">
    <div class="" v-if="order">
      <el-row>
        <el-col :span="2">
          <div class="label">订单号：</div>
        </el-col>
        <el-col :span="6">
          <div>{{ order.id }}</div>
        </el-col>
        <el-col :span="2">
          <div class="label">客户：</div>
        </el-col>
        <el-col :span="6">
          <div>{{ order.consignee }}</div>
        </el-col>
        <el-col :span="2">
          <div class="label">验货状态：</div>
        </el-col>
        <el-col :span="6">
          <div><el-link size="large">未验货</el-link></div>
        </el-col>
      </el-row>
    </div>


    <el-table
      v-loading="listLoading"
      :data="list"
      border
      fit
      highlight-current-row
      style="width: 100%;"
    >
      <el-table-column label="名称" size="mini" prop="id" align="center" width="220">
        <template slot-scope="{row}">
          <el-link v-if="checked_list['' + row.product.item_id].checked_num != checked_list['' + row.product.item_id].total" type="info">{{ row.product.product_name }}</el-link>
          <el-link v-if="checked_list['' + row.product.item_id].checked_num == checked_list['' + row.product.item_id].total" type="danger">{{ row.product.product_name }}</el-link>
        </template>
      </el-table-column>

      <el-table-column label="规格" size="mini" prop="id" align="center" width="120">
        <template slot-scope="{row}">
          <el-link v-if="checked_list['' + row.product.item_id].checked_num != checked_list['' + row.product.item_id].total" type="info">{{ row.product.item_name }}</el-link>
          <el-link v-if="checked_list['' + row.product.item_id].checked_num == checked_list['' + row.product.item_id].total" type="danger">{{ row.product.item_name }}</el-link>
        </template>
      </el-table-column>

      <el-table-column label="货号" size="mini" prop="id" align="center" width="120">
        <template slot-scope="{row}">
          <el-link v-if="checked_list['' + row.product.item_id].checked_num != checked_list['' + row.product.item_id].total" type="info">{{ row.product.sku }}</el-link>
          <el-link v-if="checked_list['' + row.product.item_id].checked_num == checked_list['' + row.product.item_id].total" type="danger">{{ row.product.sku }}</el-link>
        </template>
      </el-table-column>

      <el-table-column label="未确认" size="mini" prop="id" align="center" width="120">
        <template slot-scope="{row}">
          <el-link v-if="checked_list['' + row.product.item_id].checked_num != checked_list['' + row.product.item_id].total" type="info">{{ checked_list['' + row.product.item_id].unchecked_num }}</el-link>
          <el-link v-if="checked_list['' + row.product.item_id].checked_num == checked_list['' + row.product.item_id].total" type="danger">{{ checked_list['' + row.product.item_id].unchecked_num }}</el-link>
        </template>
      </el-table-column>

      <el-table-column label="已确认" size="mini" prop="id" align="center" width="120">
        <template slot-scope="{row}">
          <el-link v-if="checked_list['' + row.product.item_id].checked_num != checked_list['' + row.product.item_id].total" type="info">{{ checked_list['' + row.product.item_id].checked_num }}</el-link>
          <el-link v-if="checked_list['' + row.product.item_id].checked_num == checked_list['' + row.product.item_id].total" type="danger">{{ checked_list['' + row.product.item_id].checked_num }}</el-link>
        </template>
      </el-table-column>

      <el-table-column label="状态" size="mini" prop="id" align="center" width="120">
        <template slot-scope="{row}">
          <el-link v-if="checked_list['' + row.product.item_id].checked_num != checked_list['' + row.product.item_id].total">未确认</el-link>
          <el-link v-if="checked_list['' + row.product.item_id].checked_num == checked_list['' + row.product.item_id].total" type="danger">已确认</el-link>
        </template>
      </el-table-column>



      <el-table-column label="操作" width="150">
        <template slot-scope="{row}">
          <el-button type="primary" size="mini" @click="auto_confirm(row.product.item_id)">手动确认</el-button>
        </template>
      </el-table-column>

    </el-table>


  </div>
</template>
